<template>
	<view class="com borde-padd-24">
		<view class="com-bottpm">
			<!-- {{JSON.stringify(special)}} -->
			<view class="title"> {{special.title}}</view>
			<view class="label flex-wrap">
				<!-- <view class="label-list active" label>大学本科</view> -->
				<view v-for="(item,index) in special.special.label" class="label-list">{{item}}</view>
			</view>
			<view class="flex-line-height">
				<view class="flex money" v-if="special.special.money>0">
					<text class="fuho">¥</text>
					{{special.special.money}}
				</view>
				<view class="flex money" v-else>
					<text class="fuho"></text>
					免费
				</view>
				<!-- <view class="normal">
					{{special.special.money}}
				</view> -->
			</view>
		</view>
		<view class="details">
			<!-- {{JSON.stringify(special)}} -->
			<!-- {{special.special.content}} -->
			<view class="details-title">课程详情</view>
			<view class="fonCo" v-html="special.special.content"></view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			special:{
				type:Object,
				default:()=>{}
			},
			disabled:{
				type:Boolean,
				required:false,
			}
		},
		data(){
			return {
				
			}
		}
	}
</script>
<style>
	
	.fonCo{
		width: 100%;
	}
	.fonCo img{
		width: 100%;
	}
</style>
<style scoped>
		
	.com{
		background-color:#FFFFFF;
		padding-top: 24rpx;
	}
	.title{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 40rpx;
		color: #0D0E0F;
		font-style: normal;
		text-transform: none;
		margin-bottom: 10rpx;
	}
	.label-list{
		height: 48rpx;
		box-sizing: border-box;
		padding:0 16rpx;
		line-height: 48rpx;
		background: #F7F8FA;
		text-align: center;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		margin-right: 12rpx;
		color: #646669;
		text-align: center;
		font-style: normal;
		text-transform: none;
		margin-bottom: 12rpx;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	}
	.label-list.active{
		background-color: #F0F2FC;
		color: #3B5EEC;
	}
	.label{
		margin-bottom: 14rpx;
	}
	.money {
		font-family: MiSans, MiSans;
		font-weight: 600;
		font-size: 36rpx;
		color: #E26262;
		text-align: left;
		font-style: normal;
		margin-right: 16rpx;
		text-transform: none;
	}
	.money .fuho{
		margin-top: 12rpx;
		font-family: MiSans, MiSans;
		font-weight: 500;
		margin-right: 5rpx;
		font-size: 24rpx;
		color: #E26262;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.normal{
		font-family: MiSans, MiSans;
		font-weight: 400;
		font-size: 24rpx;
		color: #8F9294;
		text-align: left;
		font-style: normal;
		text-decoration-line: line-through;
		text-transform: none;
	}
	.com-bottpm{
		border-bottom: 1rpx solid #EDEAEA;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		padding-bottom: 24rpx;
	}
	.details-title{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #0D0E0F;
		text-align: left;
		font-style: normal;
		text-transform: none;
		padding-top: 24rpx;
		padding-bottom: 16rpx;
	}
	.details{
		width: 100%;
	}
	
</style>